<template>
  <view>
    <cu-custom bgColor="bg-gradual-green" :isBack="true">
      <block slot="backText">返回</block>
      <block slot="content">编辑详情</block>
    </cu-custom>

    <view style="margin-bottom: 110rpx;">
      <view class="cu-form-group">
        <view class="title">会员备注</view>
        <input type="text" style="text-align: right;" v-model="res.nickName" placeholder="请输入熟悉的客户备注~" />
      </view>

      <view class="cu-form-group">
        <view class="title">姓名</view>
        <view class="title">{{res.username}}</view>
      </view>

      <view class="cu-form-group">
        <view class="title">真实姓名</view>
        <view class="title">{{res.realName}}</view>
      </view>

      <view class="cu-form-group">
        <view class="title">手机号</view>
        <view class="title">{{res.phone}}</view>
      </view>

      <view class="cu-form-group">
        <view class="title">性别</view>
        <view class="title" v-if="res.sex == 1">男</view>
        <view class="title" v-if="res.sex == 2">女</view>
      </view>

      <view class="cu-form-group">
        <view class="title">生日</view>
        <view class="title">{{res.birthday}}</view>
      </view>

      <view class="cu-form-group">
        <view class="title">身高</view>
        <view class="title">{{res.height}}</view>
      </view>

      <view class="cu-form-group">
        <view class="title">注册时间</view>
        <view class="title">{{res.addTime}}</view>
      </view>


      <view class="cu-form-group">
        <view class="title">是否是会员</view>
        <view class="title" v-if="res.isMembers == 1">是</view>
        <view class="title" v-if="res.isMembers == 2">不是</view>
      </view>

      <view class="cu-form-group">
        <view class="title">访客到店时间</view>
        <view class="title">{{res.createTime}}</view>
      </view>

      <view class="cu-form-group">
        <view class="title">上课名称</view>
        <view class="title">{{res.courseName}}</view>
      </view>

      <view class="cu-form-group">
        <view class="title">上课时间</view>
        <view class="title">{{res.courseDate}}</view>
      </view>

      <view class="cu-form-group">
        <view class="title">会员卡名称</view>
        <view class="title">{{res.courseCard}}</view>
      </view>

      <view class="cu-form-group">
        <view class="title">推荐人</view>
        <view class="title">{{res.referees}}</view>
      </view>

      <view class="cu-form-group">
        <view class="title">备注</view>
        <view class="title">{{res.remark}}</view>
      </view>

      <view class="cu-form-group">
        <view class="title">建议</view>
        <view class="title">{{res.advice}}</view>
      </view>


      <view class="cu-form-group margin-top">
        <view class="title">已上课程数</view>
        <view class="title">{{res.hasCourseNum}}</view>
      </view>
      <template v-if="res.list.length">
        <view class="cu-form-group margin-top">
          <view class="title">会员卡列表</view>
        </view>
        <block v-for="(item, index) in res.list" :key="index">
          <view class="swiper-items">
            <view class="u-f-ac u-f-jsb detail-list">
              <view style="max-width: 45%;">{{item.gymName}}</view>
              <view>到期时间：{{item.tUseNumExpirationTime}}</view>
            </view>
            <view class="u-f-ac u-f-jsb detail-list">
              <view>私教次数：{{item.tUseNum}}次</view>
              <view>开卡时间：{{item.createTime}}</view>
            </view>
          </view>
        </block>
      </template>
    </view>

    <button class="bottom-btn u-f-ajc" @click="submit">保存信息</button>
  </view>
</template>

<script>
  export default {
    data() {
      return {
        res: {},
        id: '',
        openid: '',
      }
    },
    onLoad(e) {
      this.id = e.id
      let that = this;
      uni.getStorage({
        key: 'openid',
        success: (res) => {
          that.openid = res.data
          that.setajax()
        },
        fail: () => {}
      });
    },
    methods: {
      async setajax() {
        let res = await this.$myRuquest({
          url: "/coach/members/getCoachMembersInfo",
          data: {
            'userId': this.id,
            'coachId': uni.getStorageSync("openid"),
          }
        })
        this.res = res.data.datas
      },
      async submit() {
        let res = await this.$myRuquest({
          url: "/coach/members/updateMembers",
          method: "POST",
          data: {
            'userId': this.id,
            "nickName": this.res.nickName
          },
        })
        if (res.data.result == 200) {
          uni.showToast({
            title: "保存成功~"
          })
          uni.redirectTo({
            url: '../../pages/basics/home'
          })
        }
      }
    }
  }
</script>

<style lang="scss">
  .bottom-btn {
    width: 90%;
    height: 100rpx;
    background-color: $uni-color-zhuti;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    color: #FFFFFF;
  }

  .margin-top {
    margin-top: 30rpx;
  }


  .swiper-items {
    width: 100%;
    height: 250rpx;
    color: #333;
    padding: 0 50rpx;
    background-color: #FFFFFF;
    margin: 20rpx auto;
    flex-direction: column;
    border-radius: 30rpx;
    overflow: hidden;
  }

  .detail-list {
    width: 100%;
    height: 50%;
  }
</style>
